<%@ page contentType="text/html; charset=utf-8"%>

<%@ include file="/WEB-INF/jsp/includeCss.jsp"%>
<%@ include file="/WEB-INF/jsp/includeJs.jsp"%>
<%@ include file="/WEB-INF/jsp/includeTaglib.jsp"%>

<style type="text/css">
<!--
.steps {
	width: 800px;
	margin: 10px;
	text-align: center;
}

.steps select{
	font-size: 11px;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none
}

.steps div {
	float: left;
	margin-right: 20px;
	margin-top: 2px;
	margin-bottom: 2px;
}

.clear {
	clear: both;
}

.stepOne {
	margin-left: 6px;
	margin-bottom: 0px;
	background: #7EC0EE;
	width: 795px;
	margin-top: 10px;
	padding-left: 5px;
}

.stepOne img {
	margin-top: 5px;
	cursor: pointer;
}

.subStep {
	margin: 5px;
	background: #ffffee;
	width: 100%;
	border: solid 1px #999999;
}

.secSubStep {
	background: silver;
	margin-left: 5px;
}

.subStepTitle {
	margin-left: 5px;
	background: #CCCC99;
}

.subStepS {
	background: #99FFFF;
	width: 600px;
}
-->
</style>

<script type="text/javascript" src="<c:url value='/plan/plan.js' />"></script>
<script type="text/javascript" src="<c:url value='/js/new_job.js' />"></script>

<%@ include file="/WEB-INF/jsp/includeTaglib.jsp" %>
<script>
	//所有已设定好的任务
	var allTask=new Array();
	<c:forEach var="task" items="${taskList}" varStatus="status">
		var task=new Task({
			 id :${task.id},
		     version : ${task.version},
		     actionId :${task.actionId},
		     actionName : '${task.actionName}',
		     dataTypeId : ${task.dataTypeId},
		     dataTypeName : '${task.dataTypeName}',
		     <c:if test="${task.actionId=='4'}">
		     	taskItems : [
					<c:forEach var="taskItem" items="${task.taskItems}" varStatus="status">
						{
		                    id:${taskItem.id},
		                    version:${taskItem.version},
		                    name:'${taskItem.name}'
	                   }
						<c:if test="${!status.last}">
							,
						</c:if>
					</c:forEach>
		     	]
			</c:if>
		    <c:if test="${task.actionId!='4'}">
		    	taskItems:[]
		    </c:if>
		});
		allTask.push(task);
	</c:forEach>
</script>




<table width="100%" border="0" cellpadding="0" cellspacing="5">
	<tr>
		<td valign="top">
			<table class="dbborder" width="100%" border="0" cellpadding="0"
				cellspacing="0">
				<tr>
					<td valign="bottom" class="blueTableBg">&nbsp;配置管理&nbsp;-&nbsp;新增任务</td>
					
				</tr>
			</table>
		</td>
	</tr>
</table>

<form id="newJobForm">
<div class="globalText" style="padding: 15px;border: solid 1px #999999;width: 768px;margin-left: 15px;" >
	<c:if test="${read=='true'}">
		<div>
			<a href="javascript:;" onclick="javascript:$('#jobView').empty();$('#jobListDiv').show();
			$('input').each(function(){
				$(this).attr('disabled',false);
			});"><b style="font-size: larger;">返回</b></a>
			
			
		</div>
	</c:if>
	<br>
	<div>
		任务名称   <input id="jobName" value="${job.name}" type="text" class="txtbox required" size="20" />
		<input type="hidden" id="jobId" value="${job.id}" />
		<input type="hidden" id="jobVersion" value="${job.version}" />
	</div>
	<br>
		
	<div class="editObj">
		任务步骤项 
		<input type="button" class=" btnStyle" value="+添加步骤" onclick="javascript:addMainStep();" />
	</div>
	<br>
	<div class="editObj">
		<input onclick="javascript:submitAddJob(allTask);" type="button" class=" btnStyle" value="确认" />
		
		<input onclick="javascript:window.history.back();" type="button" class="btnStyle" value=" 返回  ">
	</div>
	
</div>
<div id="stepBlock" style="width: 800px;">
	
</div>
</form>

<div class="clear"></div>

<div style="display: none;" >
	<!--  -->
	<div id="mainStepBlock" class="globalText steps">
		<div class="stepOne">
			<div>
				<img status='close' id="openBtn" stepId="" alt="" src="<c:url value='/images/tree_arrow_close.gif' />" />
			</div>
			<div class="stepIndex" name="stepIndex"></div>
			<div name="taskList">
					
			</div>
			<div>步骤描述</div>
			<div>
				<input name='stepDes' type="text">
			</div>
			<div>
				<input name='fixed' type="checkbox"> 固定顺序
				&nbsp;
				<input id='checkBox' type="checkbox"> 是否为多选
			</div>
			<div class="editObj">
				<input id="stepDelBtn" value="删除" class="btnStyle" type="button" />
			</div>
		</div>
		<div stepId="" style="display: none;">
			
		</div>
	</div>



	<div id="subStepBlock" class="subStep">
		<div class="subStepTitle">
			<div>如果选项为：</div>
			<div style="font-weight: bold;" name="itemName"></div>
			<div class="editObj"><a index="1" subStepBranchId="" href="javascript:;">+添加子步骤</a></div>
		</div>
		<div class="clear"></div>
		
		
	</div>

	<div id="subStepBranch" class="subStepS">
		<span>
			<div name="stepIndex"></div>
			<div name="taskList"></div>
			<div>
				步骤描述 <input name='stepDes' type="text">
			</div>
			<!-- 
			<div>删除</div>
			 -->
		</span>
		<div class="clear"></div>
		
		<span id="lastSpan">
		</span>
		
	</div>

	<div id="secSubStep" class="secSubStep">
		<div name="stepName"></div>
		<div name="taskList">
		</div>
		<div>
			步骤描述 <input name='stepDes' type="text">
		</div>
<!-- 		<div>删除</div> -->
	</div>

	<!-- end -->


	<select id="allTasks" class="required">
		<option value="">--</option>
		<c:forEach var="task" items="${taskList}" varStatus="status">
			<option value='${task.actionId}' taskId='${task.id}'
				<c:if test="${task.actionId=='4'}">
					taskItems='
					<c:forEach var="taskItem" items="${task.taskItems}" varStatus="status">
						${taskItem.name},
					</c:forEach>'
				</c:if>
				<c:if test="${task.actionId=='6'}">
				
					taskItems='[
					<c:forEach var="taskItem" items="${task.taskItems}" varStatus="status" >
						<c:if test="${!status.first}">
							,
						</c:if>{"name" : "${taskItem.name}","extra1" : "${taskItem.extra1}","extra2" : "${taskItem.extra2}","extra3" : "${taskItem.extra3}"}
					</c:forEach>]'
					
				</c:if>
			>${task.taskName}</option>
		</c:forEach>
	</select>
	
	<select id="minTasks" class="required">
		<option value="">--</option>
		<c:forEach var="task" items="${taskList}" varStatus="status">
			<c:if test="${task.actionId!='4' and task.actionId!='6'}">
				<option taskId='${task.id}' value='${task.actionId}'>${task.taskName}</option>
			</c:if>
		</c:forEach>
	</select>
</div>


<script>
	var jobJson=${jobJsonString};

	for(var i=0;i<jobJson.steps.length;i++){
		var step=jobJson.steps[i];
		var stepId=i+1;
		var fixed=(step.fixed==1) ? true : false;
		var mainStepBlock=addMainStep();
		
		$(mainStepBlock).find('#main_task_fixed_step_id_'+stepId).attr("checked",fixed);
		$(mainStepBlock).find('#main_task_name_step_id_'+stepId).val(step.name);
		
		if(step.checkBox==1){
			$(mainStepBlock).find('#checkBox').attr("checked",true);
		}
		
		
		$(mainStepBlock).find("option").each(function(){
			if(String(step.task.id)==String(this.getAttribute("taskId"))){
				$(this).attr("selected",true)  
				if(this.value==4){
					openCloseSubStep("step_id_"+stepId,'close');
					$(mainStepBlock).find("#openBtn").bind("click",function(){
						openCloseSubStep(this.getAttribute("stepid"));
					});
				}
			}
		});
		
		
		
		var stepItems=step.stepItems;
		if(stepItems.length<1){
			continue;
		}
		
		for(var j=0;j<stepItems.length;j++){
			var stepItem=stepItems[j];
			var taskItem=stepItem.taskItem;
			var subStep=stepItem.steps;
			
			var subStepBlock=addSubTask("step_id_"+stepId,taskItem.name,(j+1));
			
			for(var k=0;k<subStep.length;k++){
				
				$(subStepBlock).find("a[subStepBranchId]").attr("index",(k+2));
				
				var subBranchTask=addSubBranchTask("step_id_"+stepId,"step_id_"+stepId+"_"+(j+1),(k+1));
				
				$(subBranchTask).find("#stepitemBranch_name_step_id_"+stepId+"_"+(j+1)+"_"+(k+1)).val(subStep[k].name);
				$(subBranchTask).find("option").each(function(){
					if(String(subStep[k].task.id)==String(this.getAttribute("taskId"))){
						$(this).attr("selected",true)  
					}
				});
				
				var subStepItems=subStep[k].stepItems;
				if(subStepItems.length<1){
					continue;
				}
				
				for(var n=0;n<subStepItems.length;n++){
					var subStepBlock=addLastTask("step_id_"+stepId+"_"+(j+1)+"_"+(k+1),
									 			 subStepItems[n].taskItem.name,
												 (n+1));
					
					var subSteps=subStepItems[n].steps;
					if(subSteps.length<1){
						continue;
					}
					
					for(var m=0;m<subSteps.length;m++){
						$(subStepBlock).find("a[subStepBranchId]").attr("index",m+2)
						var lastSubStep=subSteps[m];
						
						var secSubStep=addLastStepTask("step_id_"+stepId+"_"+(j+1)+"_"+(k+1)+"_"+(n+1),
													   (m+1));
						$(secSubStep).find("option").each(function(){
							if(String(lastSubStep.task.id)==String(this.getAttribute("taskId"))){
								$(this).attr("selected",true)  
							}
						});
						
						$(secSubStep).find("[name='stepDes']").val(lastSubStep.name);
						
					}
				}
			}
		}
	}
</script>


<script>
	<c:if test="${read!='true'}">
		$().ready(function() {
			var validate=$("#newJobForm").validate({
				showErrors: customShowErrors,
				onfocusout:false,
				onkeyup:false,
				onclick:false
			});
		});
	</c:if>
	<c:if test="${read=='true'}">
		$(".editObj").each(function(){
			$(this).remove();
		});
		
		
		$("input").each(function(){
			$(this).attr("disabled",true);
		});
		
		$("select").each(function(){
			$(this).attr("disabled",true);
		});
	</c:if>
	
	
</script>


